<%@ page session="true" isELIgnored="false" %> <%@ taglib prefix="c"
uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib prefix="form"
uri="http://www.springframework.org/tags/form" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Global Domination</title>
<script type="text/javascript"
	src="http://www.google.com/jsapi?key=ABQIAAAAkX4jjRDYEMLIfiC7Fs6ZFBRlOb26qSyU154aZeLwOrF4C7-DphRUK1aqWRbYpF4qQPq5mH8D7De9WQ">
        </script>
<link type="text/css"
	href="css/ui-lightnessx/jquery-ui-1.8rc3.custom.css" rel="stylesheet" />

<link href="css/jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />

<!--  
     <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
     <link type="text/css"	href="css/ui-lightnessx/jquery-ui-1.8rc3.custom.css" rel="stylesheet" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js">       </script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js">       </script>
<script type="text/javascript" src="js/markermanager_packed.js">
        </script> !window.jQuery && document.write('<script src="localjQuery.js"><\/script>');
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>


-->

<script type="text/javascript" src="js/jquery-nightly.js">       </script>
<script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js">       </script>

<script type="text/javascript" src="js/appmap.js">    </script>


<script type="text/javascript" src="js/appres.js">       </script>
<script type="text/javascript" src="js/appjq.js">      </script>

<script src="js/jquery.alerts.js" type="text/javascript"></script>

<link rel="stylesheet" type="text/css" href="css/app.css" />


<script type="text/javascript" src="js/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="js/yui/build/element/element-min.js"></script>
<script src="js/yui/build/carousel/carousel-min.js"></script>
<link type="text/css" rel="stylesheet" 	href="js/yui/build/carousel/assets/skins/sam/carousel.css">

<script type="text/javascript">

//  var _gaq = _gaq || [];
 //// _gaq.push(['_setAccount', 'UA-17940542-1']);
 // _gaq.push(['_trackPageview']);

 // (function() {
//    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
//    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
 //   var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 // })();

</script>
</head>
<body>
<div id="nowloading" class="ui-widget-overlay loader" style="display:block;">
<img src="images/loading.gif" onclick="hideLoading()">
<br>
<p class="info">
Loading...
</p>
</div>
<table width="100%">
	<tr>
		<td width="250px" id="leveltd"><span id="leveldisp"></span>
		</td>
		<td id="resperc0" class="ui-widget-header "></td>
		<td id="resperc1" class="ui-widget-header "></td>
		<td id="resperc2" class="ui-widget-header "></td>
		<td id="resperc3" class="ui-widget-header "></td>
		<td id="resperc4" class="ui-widget-header "></td>
		<td id="resperc5" class="ui-widget-header "></td>
		<td id="resperc6" class="ui-widget-header " style="background-color:maroon"></td>
		</tr>
</table>

<div id="tabs">
<ul>
	<li><a href="#tabsCivilian">Civilian</a></li>
	<li><a href="#tabsMil">Military</a></li>
	<li><a href="#tabsTerritory">Territory</a></li>
	<li><a href="#tabsWar">War</a></li>
</ul>
<div id="tabsCivilian" class="minh">


		<div  style="width:15%; height:250px;float:left">
		<div id="divfree" style="height:100px">
		
		</div>
		<br>
		<br>
		<div id="timerfree" style="height:100px">
		</div>
		</div>
		
		<div id="accordion"  style="float:right;width:85%">
		<div>
		<h3><a href="#">Food</a></h3>
		<div>

		<table class="fullheight">
			<tr>
				<td style="width: 25%"><img
					src="images/civresources/foodiconi.png"></td>

				<td>
				<table class="fullheight">
					<tr>
						<td><span class="resStat" id="resfood">- </span></td>
					</tr>
					<tr>
						<td align="left"><span class="buttonRes" id="addfood">Deploy Civilian
						</span> <span class="buttonResRem" id="remfood">Remove Civilian</span></td>
					</tr>
				</table>
				</td>
			</tr>
		</table>



		</div>
		</div>
		<div>
		<h3><a href="#">Water</a></h3>
		<div>

		<table class="fullheight">
			<tr>
				<td style="width: 25%"><img
					src="images/civresources/watericon.png" width="128px"
					height="128px"></td>

				<td>
				<table class="fullheight">
					<tr>
						<td><span class="resStat" id="reswater">- </span></td>
					</tr>
					<tr>
						<td align="left"><span class="buttonRes" id="addwater">Deploy Civilian
						</span> <span class="buttonResRem" id="remwater">Remove Civilian </span></td>
					</tr>
				</table>
				</td>
			</tr>
		</table>





		</div>
		</div>
		<div>
		<h3><a href="#">Oil</a></h3>
		<div>

		<table class="fullheight">
			<tr>
				<td style="width: 25%"><img
					src="images/civresources/oilicon.png"></td>

				<td>
				<table class="fullheight">
					<tr>
						<td><span class="resStat" id="reshay">- </span></td>
					</tr>
					<tr>
						<td align="left"><span class="buttonRes" id="addhay">Deploy Civilian
						</span> <span class="buttonResRem" id="remhay">Remove Civilian </span></td>
					</tr>
				</table>
				</td>
			</tr>
		</table>

		</div>
		</div>
		<div>
		<h3><a href="#">Wood</a></h3>
		<div>

		<table class="fullheight">
			<tr>
				<td style="width: 25%"><img
					src="images/civresources/woodicon.png"></td>

				<td>
				<table class="fullheight">
					<tr>
						<td><span class="resStat" id="reswood">- </span></td>
					</tr>
					<tr>
						<td align="left"><span class="buttonRes" id="addwood">Deploy Civilian
						</span> <span class="buttonResRem" id="remwood">Remove Civilian </span></td>
					</tr>
				</table>
				</td>
			</tr>
		</table>




		</div>
		</div>
		<div>
		<h3><a href="#">Silver</a></h3>
		<div>
		<table class="fullheight">
			<tr>
				<td style="width: 25%"><img
					src="images/civresources/silvericon.png"></td>

				<td>
				<table class="fullheight">
					<tr>
						<td><span class="resStat" id="ressilver">- </span></td>
					</tr>
					<tr>
						<td align="left"><span class="buttonRes" id="addsilver">Deploy Civilian
						</span> <span class="buttonResRem" id="remsilver">Remove Civilian </span></td>
					</tr>
				</table>
				</td>
			</tr>
		</table>


		</div>
		<div>
		<h3><a href="#">Gold</a></h3>
		<div>

		<table class="fullheight">
			<tr>
				<td style="width: 25%"><img
					src="images/civresources/goldicon.png"></td>

				<td>
				<table class="fullheight">
					<tr>
						<td><span class="resStat" id="resgold">- </span></td>
					</tr>
					<tr>
						<td align="left"><span class="buttonRes" id="addgold">Deploy Civilian
						</span> <span class="buttonResRem" id="remgold">Remove Civilian </span></td>
					</tr>
				</table>
				</td>
			</tr>
		</table>


		</div>
		</div>
		</div>


		</div>
		
</div>
<div id="tabsMil" class="minh">
<div id="milaccordion">
<div>
<h3><a href="#">Army</a></h3>
<div>



<table class="fullheight">
	<tr>
		<td style="width: 25%"><img src="images/military/army.png" />
		<table class="mildefence">
		<tbody><tr><td> 
		<img width="50px" height="50px" src="images/military/attack.png"> <span id="milatt0"></span>  </td>
		<td><img width="50px" height="50px" src="images/military/defence.png"><span id="mildef0"></span>  </td></tr>
		</tbody></table>
		</td>
		<td style="width: 75%;" valign="top">

		<table class="fullheight">

			<tr>
				<td><span class="resStat" id="resArmy">0 Army </span></td>
			</tr>
			<tr>
				<td>
				<table style="width: 100%;">
					<tr>
						<td valign="top">Cost</td>
						<td valign="top"><span id="milcost00" class="milcost"><img
							src="images/loading/loading1.gif" /></span></td>
						<td valign="top"><span id="milcost01" class="milcost"></span></td>
						<td valign="top"><span id="milcost02" class="milcost"></span></td>
						<td valign="top"><span id="milcost03" class="milcost"></span></td>
						<td valign="top"><span id="milcost04" class="milcost"></span></td>
						<td valign="top"><span id="milcost05" class="milcost"></span></td>
					</tr>
				</table>
				</td>
			</tr>
			<tr>
				<td align="right"><span class="buttonMil" id="createArmy">Create
				</span></td>
			</tr>
		</table>
		</td>
	</tr>
</table>


</div>
</div>
<div>
<h3><a href="#">Tank</a></h3>
<div>

<table class="fullheight">
	<tr>
		<td style="width: 25%"><img src="images/military/tankicon.png" />
		<table class="mildefence">
		<tbody><tr><td> 
		<img width="50px" height="50px" src="images/military/attack.png"> <span id="milatt1"></span>  </td>
		<td><img width="50px" height="50px" src="images/military/defence.png"><span id="mildef1"></span>  </td></tr>
		</tbody></table>
		</td>
		<td style="width: 75%;" valign="top">

		<table class="fullheight">

			<tr>
				<td><span class="resStat" id="resTank">0 Tanks </span></td>
			</tr>
			<tr>
				<td>
				<table style="width: 100%;">
					<tr>
						<td valign="top">Cost</td>
						<td valign="top"><span id="milcost10" class="milcost"><img
							src="images/loading/loading1.gif" /></span></td>
						<td valign="top"><span id="milcost11" class="milcost"></span></td>
						<td valign="top"><span id="milcost12" class="milcost"></span></td>
						<td valign="top"><span id="milcost13" class="milcost"></span></td>
						<td valign="top"><span id="milcost14" class="milcost"></span></td>
						<td valign="top"><span id="milcost15" class="milcost"></span></td>
					</tr>
				</table>
				</td>
			</tr>
			<tr>
				<td align="right"><span class="buttonMil" id="createTank">Create
				</span></td>
			</tr>
		</table>
		</td>
	</tr>
</table>

</div>
</div>
<div>
<h3><a href="#">Aircraft</a></h3>
<div>

<table class="fullheight">
	<tr>
		<td style="width: 25%"><img src="images/military/airicon2.png" />
		<table class="mildefence">
		<tbody><tr><td> 
		<img width="50px" height="50px" src="images/military/attack.png"> <span id="milatt2"></span>  </td>
		<td><img width="50px" height="50px" src="images/military/defence.png"><span id="mildef2"></span>  </td></tr>
		</tbody></table>
		</td>
		<td style="width: 75%;" valign="top">

		<table class="fullheight">

			<tr>
				<td><span class="resStat" id="resAir">0 Aircraft </span></td>
			</tr>
			<tr>
				<td>
				<table style="width: 100%;">
					<tr>
						<td valign="top">Cost</td>
						<td valign="top"><span id="milcost20" class="milcost"><img
							src="images/loading/loading1.gif" /></span></td>
						<td valign="top"><span id="milcost21" class="milcost"></span></td>
						<td valign="top"><span id="milcost22" class="milcost"></span></td>
						<td valign="top"><span id="milcost23" class="milcost"></span></td>
						<td valign="top"><span id="milcost24" class="milcost"></span></td>
						<td valign="top"><span id="milcost25" class="milcost"></span></td>
					</tr>
				</table>
				</td>
			</tr>
			<tr>
				<td align="right"><span class="buttonMil" id="createAir">Create
				</span></td>
			</tr>
		</table>
		</td>
	</tr>
</table>


</div>
</div>
<div>
<h3><a href="#">Navy</a></h3>
<div>
<table class="fullheight">
	<tr>
		<td style="width: 25%"><img src="images/military/navyicon.png" /><table class="mildefence">
		<tbody><tr><td> 
		<img width="50px" height="50px" src="images/military/attack.png"> <span id="milatt3"></span>  </td>
		<td><img width="50px" height="50px" src="images/military/defence.png"><span id="mildef3"></span>  </td></tr>
		</tbody></table></td>
		<td style="width: 75%;" valign="top">

		<table class="fullheight">

			<tr>
				<td><span class="resStat" id="resNavy">0 Navy </span></td>
			</tr>
			<tr>
				<td>
				<table style="width: 100%;">
					<tr>
						<td valign="top">Cost</td>
						<td valign="top"><span id="milcost30" class="milcost"><img
							src="images/loading/loading1.gif" /></span></td>
						<td valign="top"><span id="milcost31" class="milcost"></span></td>
						<td valign="top"><span id="milcost32" class="milcost"></span></td>
						<td valign="top"><span id="milcost33" class="milcost"></span></td>
						<td valign="top"><span id="milcost34" class="milcost"></span></td>
						<td valign="top"><span id="milcost35" class="milcost"></span></td>
					</tr>
				</table>
				</td>
			</tr>
			<tr>
				<td align="right"><span class="buttonMil" id="createNavy">Create
				</span></td>
			</tr>
		</table>
		</td>
	</tr>
</table>


</div>
</div>
<div>
<h3><a href="#">Spies</a></h3>
<div>

<table class="fullheight">
	<tr>
		<td style="width: 25%"><img src="images/military/spy.png" />
		<table class="mildefence">
		<tbody><tr><td> 
		<img width="50px" height="50px" src="images/military/attack.png"> <span id="milatt4"></span>  </td>
		<td><img width="50px" height="50px" src="images/military/defence.png"><span id="mildef4"></span>  </td></tr>
		</tbody></table>
		</td>
		<td style="width: 75%;" valign="top">

		<table class="fullheight">

			<tr>
				<td><span class="resStat" id="resSpies">0 Spies </span></td>
			</tr>
			<tr>
				<td>
				<table style="width: 100%;">
					<tr>
						<td valign="top">Cost</td>
						<td valign="top"><span id="milcost40" class="milcost"><img
							src="images/loading/loading1.gif" /></span></td>
						<td valign="top"><span id="milcost41" class="milcost"></span></td>
						<td valign="top"><span id="milcost42" class="milcost"></span></td>
						<td valign="top"><span id="milcost43" class="milcost"></span></td>
						<td valign="top"><span id="milcost44" class="milcost"></span></td>
						<td valign="top"><span id="milcost45" class="milcost"></span></td>
					</tr>
				</table>
				</td>
			</tr>
			<tr>
				<td align="right"><span class="buttonMil" id="createSpy">Create
				</span></td>
			</tr>
		</table>
		</td>
	</tr>
</table>

</div>
</div>
<div>
<h3><a href="#">Submarines</a></h3>
<div>


<table class="fullheight">
	<tr>
		<td style="width: 25%"><img src="images/military/subicon.png" />
		<table class="mildefence">
		<tbody><tr><td> 
		<img width="50px" height="50px" src="images/military/attack.png"> <span id="milatt5"></span>  </td>
		<td><img width="50px" height="50px" src="images/military/defence.png"><span id="mildef5"></span>  </td></tr>
		</tbody></table></td>
		<td style="width: 75%;" valign="top">

		<table class="fullheight">

			<tr>
				<td><span class="resStat" id="resSubs">0 Submarine </span></td>
			</tr>
			<tr>
				<td>
				<table style="width: 100%;">
					<tr>
						<td valign="top">Cost</td>
						<td valign="top"><span id="milcost50" class="milcost"><img
							src="images/loading/loading1.gif" /></span></td>
						<td valign="top"><span id="milcost51" class="milcost"></span></td>
						<td valign="top"><span id="milcost52" class="milcost"></span></td>
						<td valign="top"><span id="milcost53" class="milcost"></span></td>
						<td valign="top"><span id="milcost54" class="milcost"></span></td>
						<td valign="top"><span id="milcost55" class="milcost"></span></td>
					</tr>
				</table>
				</td>
			</tr>
			<tr>
				<td align="right"><span class="buttonMil" id="createSubs">Create
				</span></td>
			</tr>
		</table>
		</td>
	</tr>
</table>
</div>
</div>
</div>

</div>
<div id="tabsTerritory" class="minh">

<table width="100%" border=0>
	<tr>
		<td width="75%" valign="top">
		<div id="territory_map" class="mapHeight"><img
			src="images/loading.gif" alt="Loading.Please wait.." /></div>
		</td>
		<td width="25%" valign="top">

		<div id="territory_info" class="minh">

		<div id="territory_hint" class="minh">
		<p class="info">
		Click on an area in the map and click "Add Base" to build a new
		territory. <br> Tip:The farther you city from HeadQuarters the more Dominator dollars it generates!
		<br>
		Click on any baseto view your current deployments and also to
		deploy new military units to it.  
		</p>
		</div>

		<div class="depcostpanel" id="depcostpanel" style="border: 2; display: none;">
		<table class="territoryCostTable">
			<thead class="stats">
				<tr>
					<th>Resource</th>
					<th>Cost</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td><img src='images/civresources/foodthumb.png'> Food</td>
					<td id="tcost0">-</td>
				</tr>
				<tr>
					
					<td id="tdcost0" colspan="2"></td>
				</tr>
				<tr>
					<td><img src='images/civresources/waterthumb.png'> Water
					</td>
					<td id="tcost1">-</td>
				</tr>
				<tr>
					
					<td id="tdcost1" colspan="2"></td>
				</tr>
				<tr>
					<td><img src='images/civresources/oilthumb.png'> Oil</td>
					<td id="tcost2">-</td>
				</tr>
				<tr>
					
					<td id="tdcost2" colspan="2"></td>
				</tr>
				<tr>
					<td><img src='images/civresources/woodthumb.png'> Wood</td>
					<td id="tcost3">-</td>
				</tr>
				<tr>
					 
					<td id="tdcost3" colspan="2"></td>
				</tr>
				<tr>
					<td><img src='images/civresources/silverthumb.png'>
					Silver</td>
					<td id="tcost4">-</td>
				</tr>
				<tr>
				 
					<td id="tdcost4" colspan="2"></td>
				</tr>
				<tr>
					<td><img src='images/civresources/goldthumb.png'> Gold</td>
					<td id="tcost5">-</td>
				</tr>
				<tr>
				 
					<td id="tdcost5" colspan="2"></td>
				</tr>
			</tbody>
		</table>
		<table border="0" width="100%">
			<tr>
				<td><span class="genbutton" id="addloc">Add Base</span></td>
			</tr>
		</table>
		</div>
		<div class="depResult" id="depResult" style="border: 2; display: none;"><img
			src="images/loading.gif" alt="Loading.Please wait.." /></div>
		</div>
		</td>
	</tr>
</table>

</div>

<div id="tabsWar" class="minh">

<table width="100%" border=0>
	<tr>
		<td width="75%" valign="top">
		<div id="warmap_canvas" class="mapHeight"><img
			src="images/loading.gif" alt="Loading.Please wait.." /></div>
		</td>
		<td width="25%" valign="top">
		<div id="ally_info" class="minh">
		<div id="enemypanel"><p class="info">This is your war panel.<br> 
		Search for enemies.	Crush them all!
		<br><br>
		Your enemies are marked by the devil icon.<br> 
		You cannot view the army deployed to protect that base until you reach
		level 30
		</p></div>
		</div>
		</td>
	</tr>
</table>

</div>
</div>

<script language="javascript" type="text/javascript">
                                                                                                                                                                    
									var MAX_MIL_RES=6;  
									var MAX_CIV_RES=7;            					
                                    var homeLat = ${homeLat};
                                    var homeLon = ${homeLon};
                                    var en="${enemyCountry}";
                                    var hc="${homeCountry}";
                                     var timerID; 
                                     var noticeTimer;           
                                    var resources = new Array(10);
                                    var mresources = new Array(10);
                                    var mAttack= new Array(10);
                                    var mDefend= new Array(10);
                                    var totalRes = ${totalRes};
                                    var milcost = new Array(5);
                                    var costhumb =[];
                                    var isResDirty = new Array(5);
                                    var isMilResDirty = new Array(5);
                                    var yahooInited=false;
                                    var xminutes=10;
                                    var mpassed=0;
                                    var resCheckTime=60000;
                                    var myLevel=${level};
                                    var clickable=false;
                                    
                                    $(document).ready(function(){                            
                                        initMain();

                                        YAHOO.util.Event.onDOMReady(function (ev) {
      									  
      									  yahooInited=true;
      			  
      	                  });
                                    
                                    });
                                    
                                    function initMain(){
                                    	
                                    timerID=setInterval(timerUpdate,60000);
                                    checkNotice();
                                    noticeTimer=setInterval(checkNotice,resCheckTime*20);
                                    for (i = 0; i < 10; i++) {
                                    resources[i] = [0,0,0];	
                                    }
                                   
                                    costhumb.push("<img width=36 height=36 title='Food ' src='images/civresources/foodthumb.png'>");
                                    costhumb.push("<img width=36 height=36 title='Water ' src='images/civresources/waterthumb.png'>");
                                    costhumb.push("<img width=36 height=36 title='Oil ' src='images/civresources/oilthumb.png'>");
                                    costhumb.push("<img width=36 height=36 title='Wood ' src='images/civresources/woodthumb.png'>");
                                    costhumb.push("<img width=36 height=36 title='Silver ' src='images/civresources/silverthumb.png'>");
                                    costhumb.push("<img width=36 height=36 title='Gold ' src='images/civresources/goldthumb.png'>");
                                    costhumb.push("<img width=36 height=36 title='Dollar ' src='images/civresources/dollarthumb.png'>");
                                  //  costhumb[7]="<img width=36 height=36 title='Your XP points' src='images/civresources/xpthumb.png'>";
                                  //  costhumb[8]="<img width=36 height=36  title='Your Karma' src='images/civresources/karma1thumb.png'>";  
                                    costhumb.push("<img width=50 height=50 title='Army ' src='images/military/army.png'>");
                                    costhumb.push("<img width=50 height=50 title='Tanks ' src='images/military/tankicon.png'>");
                                    costhumb.push("<img width=50 height=50 title='Aircraft ' src='images/military/airicon2.png'>");
                                    costhumb.push("<img width=50 height=50 title='Navy ' src='images/military/navyicon.png'>");
                                    costhumb.push("<img width=50 height=50 title='Spies ' src='images/military/spy.png'>");
                                    costhumb.push("<img width=50 height=50 title='Submarines ' src='images/military/subicon.png'>");
                                  
                                  
                                    for (i = 0; i < MAX_MIL_RES; i++) {
                                    milcost[i] = new Array(MAX_MIL_RES);	
                                    milcost[i][0]=90 * (i+1);
                                    milcost[i][1]=80 * (i+1);
                                    milcost[i][2]=70 * (i+1);
                                    milcost[i][3]=60 * (i+1);
                                    milcost[i][4]=50 * (i+1);
                                    milcost[i][5]=40 * (i+1);

                                    for (icost = 0; icost < MAX_MIL_RES; icost++) {
                                    		$('#milcost' + i +""+ icost).html(costhumb[icost] +""+milcost[i][icost]);
                                        }
                                    
                                    }
                                    
                                    <c:forEach items="${civresource}" var="resource">
                                    resources[<c:out value="${resource.resType}"/>][0]=<c:out value="${resource.civDeployed}"/>;
                                    resources[<c:out value="${resource.resType}"/>][1]=<c:out value="${resource.resAvailable}"/>;
                                    resources[<c:out value="${resource.resType}"/>][2]=<c:out value="${resource.civDeployed}"/>;
                                    </c:forEach>
                                  
                                    <c:forEach items="${milresource}" var="mresource">
                                    mresources[<c:out value="${mresource.unitType}"/>]=<c:out value="${mresource.milAvailable}"/>;
                                    mAttack[<c:out value="${mresource.unitType}"/>]=<c:out value="${mresource.attackPoint}"/>;
                                    mDefend[<c:out value="${mresource.unitType}"/>]=<c:out value="${mresource.defendPoint}"/>;
                                    </c:forEach>            
                                    
                                    totalRes = totalRes - (resources[0][0] + resources[1][0] + resources[2][0] + resources[3][0] + resources[4][0] + resources[5][0]);
									
                                    syncResControls();
                                    syncMilControls();
                                    syncMilDefence();
                                   syncResData();  
                                 
                                   showLevel(myLevel);
                              	 hideLoading(); 
                                syncServer(); 
                                openfirst();
                                    }

                                    function showLoading()
                                    {
                                    	$("#nowloading").attr("style","display:block")
                                    }
                                    function hideLoading()
                                    {
                                    	$("#nowloading").attr("style","display:none")
                                    }

                                    function showMiniLoading()
                                    {
                                    	$("#miniloading").attr("style","display:block")
                                    	setTimeout(hideMiniLoading,30000);
                                    }
                                    function hideMiniLoading()
                                    {
                                    	$("#miniloading").attr("style","display:none")
                                    }
                                
                                    google.load('maps', '3', {other_params: 'sensor=false'});
                                    google.load('visualization', '1', {'packages':['gauge']});
                                    google.setOnLoadCallback(drawGauge);
                                  
                                    var gauge;
                                    var gaugeData;
                                    var gaugeOptions;
                                    
                                    var tgauge;
                                    var tgaugeData;
                                    var tgaugeOptions;
                                    
                                    var isGoogleLoaded=false;
                                    function drawGauge()
                                    {
                                    	 gaugeData = new google.visualization.DataTable();
                                    	 gaugeData.addColumn('number', 'Free Civilians'); 
                                    	 gaugeData.addRows(1);
                                         gaugeData.setCell(0, 0, 100);    
                                         gauge = new google.visualization.Gauge(document.getElementById('divfree'));
                                         gaugeOptions = {
                                                 min: 0,
                                                 max: ${totalRes},
                                                 yellowFrom: 10,
                                                 yellowTo: 20,
                                                 redFrom: 0,
                                                 redTo: 10,
                                                 minorTicks: 5
                                             };

                                         gauge.draw(gaugeData, gaugeOptions);
                                         
                                     	 tgaugeData = new google.visualization.DataTable();
                                    	 tgaugeData.addColumn('number', 'Next Update'); 
                                    	 tgaugeData.addRows(1);
                                         tgaugeData.setCell(0, 0, 10);    
                                         tgauge = new google.visualization.Gauge(document.getElementById('timerfree'));
                                         tgaugeOptions = {
                                                 min: 0,
                                                 max: xminutes,
                                                 yellowFrom: 1,
                                                 yellowTo: 2,
                                                 redFrom: 0,
                                                 redTo: 1,
                                                 minorTicks: 2
                                             };

                                         tgauge.draw(tgaugeData, tgaugeOptions);
                                         
                                         isGoogleLoaded=true;
                                         
                                         changeIdleResource(totalRes);
                                         timerUpdate();
                                    }            

                                    function changeIdleResource(newvalue)
                                    {if(isGoogleLoaded)
                                        {
                                    	gaugeData.setValue(0, 0,newvalue);
                                    	gauge.draw(gaugeData, gaugeOptions);
										}
										$("#divfree").append("<div title='Free civilians that are ready to be deployed to collect resources' class=freetext'>" +newvalue + "</div>");
                                    }
                                  
                                    function changeTimeRem(newvalue)
                                    {if(isGoogleLoaded)
                                        {
                                    	tgaugeData.setValue(0, 0,newvalue);
                                    	tgauge.draw(tgaugeData, tgaugeOptions);
										}
										$("#timerfree").append("<div title='Minutes remaining for next update of resources' class=freetime'>" + (newvalue==0? " Updating..." : newvalue + " minutes") + "</div>");
                                    }

 
        </script>



<script type="text/javascript">

var fbtoken="${fbtoken}";

  function publishPost(to,msg,caption,desc,imgsrc,link)
  {
	  
	   if (typeof link  == "undefined")
		  link='http://apps.facebook.com/globaldominator';
		
		if (typeof imgsrc  == "undefined")
		 imgsrc= 'http://global-dominator.appspot.com/images/feeds/lose.png';
		
		
	
		$.post("https://graph.facebook.com/"+to+"/feed?access_token="+fbtoken +"&description="+desc+"&picture="+imgsrc+"&link="+link+"&message="+msg+"&name="+ caption+"&actions={'name': 'Join Me', 'link': 'http://apps.facebook.com/globaldominator'}", {
			
		}, function(rtnmsg) {
						
						});
		
	
	
  }
  
  var firsttime="<%= session.getAttribute( "firsttime" ) %>";
  
  function openfirst()
  {
  if(firsttime=="true")
	  {
	  //open tutorial
	
	  }
  }
</script>
	<table>
		<tr><td> <button class="tbutton" id="marketbtn" title="Market for buying and selling resources"><img src="images/toolbar/shopping.png" border=0></button></td>
<td><button class="tbutton" id="researchbtn" title="Research and upgrade your gameplay"><img src="images/toolbar/research.png" border=0></button> </td>
<td><button class="tbutton" id="alliesbtn" title="Allies and friends"><img src="images/toolbar/friends.png" border=0></button> </td>
<td> <button class="tbutton" id="messagesbutton" title="Messages for you"><img src="images/toolbar/email.png" border=0><span id="msgtext"> </span> </button></td>
<td> <button class="tbutton" id="xstats" title="Global Leaderboard"><img src="images/toolbar/stats.png" border=0></button></td>
<!--td> <button class="tbutton" id="xfriends" title="Invite Your Friends"><img src="images/toolbar/stats.png" border=0></button></td>
 <td> <button class="tbutton" id="govtbtn" title="Government"><img src="images/toolbar/govt.png" border=0></button></td>
<td> <button class="tbutton" id="missionbtn" title="Choose a Mission"><img src="images/toolbar/missions.png" border=0> Missions</button></td-->
<td width="100%">&nbsp;</td>
<td> <a href="http://spreadsheets.google.com/viewform?formkey=dFdjeU9PNjBYV2NKV3E0Nl9rSzlYalE6MQ" target="_blank"><img src="images/toolbar/feedback.png" border=0 width=80 height=80> </a> </td>
</tr>
</table>

<div id="marketPopup" class="popup"></div>
<div id="researchPopup" class="popup"></div>
<div id="alliesPopup" class="popup"></div>
<div id="statsPopup"></div>


<div id="messagesPopup" class="popup">
<div id="nomessages">
You have no new messages!
</div>
<ol id="messages">

</ol>
</div>

<div id="levelPopup" style="background-image:url('../images/bgs/levelup.jpg');">

<div id="leveldispd">

</div>
<div id="dollarreq">
</div>
</div>

<div id="missionsPopup">
<button class="tbutton" id="btnMissions" title="Upgrade your level">
<span id="leveldisp"></span>
<img src="images/toolbar/stats.png" border=0></button>

</div>

<div id="miniloading" class="ui-widget-overlay loader" style="display:none;">
<img src="images/loading.gif" onclick="hideLoading()">
<br>
<p class="info">
Loading.....
</p>
</div>

<div id="dialogconfirm">
</div>
</body>
</html>
